<template>
    <div id="listAdd" class="content">
        <!-- 页面标题 -->
        <div class="tilte-bar">新增订单总页面</div>
        <div class="padding-1">
            <!-- 提交成功提示框 -->
            <div class="weui-toast" v-if="successFlag">
                <i class="weui-icon-success-no-circle weui-icon_toast"></i>
                <p class="weui-toast__content">提交成功</p>
            </div>
            <!-- weui 订单详细信息 -->
            <div class="weui-form-preview__hd weui-cell-background-color">
                <div class="weui-form-preview__item">
                    <label class="weui-form-preview__label">订单详情</label>
                </div>
            </div>
            <div class="weui-cell weui-cell-background-color"  v-for="(value, key) in orderDetails">
                <div class="weui-cell__bd">
                    <p>{{key}}：</p>
                </div>
                <div class="weui-cell__ft">{{value}}</div>
            </div>
            <!-- 添加设备按钮 -->
            <template v-if="buttonLoading">
                <a class="weui-btn weui-btn_disabled weui-btn_primary margin-1">添加设备</a>
            </template>
            <template v-else>
                <a class="weui-btn weui-btn_primary margin-1" @click="addDevice">添加设备</a>
            </template>
            <!-- 已有设备列表 -->
            <deviceList :deviceList="devList" :isClick=false></deviceList>
            <!-- 提交订单按钮 -->
            <div v-if="warnningTag" class="button-warnning">{{warnningMessage}}</div>
            <template v-if="buttonLoading">
                <a class="weui-btn weui-btn_primary weui-btn_loading"><i class="weui-loading"></i>提交订单</a>
            </template>
            <template v-else>
                <a class="weui-btn weui-btn_primary margin-1" @click="listAdd">提交订单</a>
            </template>
        </div>
    </div>
</template>

<script>
    import deviceList from '@/components/deviceList.vue'
    export default {
        data () {
            return {
                //成功标志
                successFlag: false,
                // showReference: '',
                // showDeviceType: '',
                //订单详细信息
                orderDetails: {},
                // 订单详细信息的字典
                // 是否显示loading按钮
                buttonLoading: false,
                KEY_DICT: {
                    "salesman_name": "业务员",
                    "order_org": "委托单位",
                    "applicant_name": "经办人",
                    "applicant_phonenum": "经办人电话",
                    "check_phonenum": "传真",
                    "device_use_org": "使用单位",
                    // "use_contactor": "使用单位联系人",
                    // "use_phone_number": "使用单位联系人电话",
                    "device_install_org": "安装单位",
                    // "install_contactor": "安装单位联系人",
                    // "install_phone_number": "安装单位电话",
                    "payment_type": "付款方式",
                    "get_report_type": "报告领取方式",
                    "checker_loginnames": "期望检验员",
                    "checkDate_expect": "期望检验日期",
                    "contactPersonName": "检验方联系人",
                    "project_name": "工程名称",
                    "addressSimple": "工程地址",
                    "project_address": "工程详细地址"
                },
                devList: [],
                warnningTag: false,
                warnningMessage: ''
            }
        },
        mounted () {
            this.successFlag = false;
            this.showOrder();
            this.showDeviceList();
        },
        components: {
            deviceList: deviceList
        },
        methods: {
            // 显示订单信息
            showOrder: function() {
                var _self = this;
                let tmp = JSON.parse(window.localStorage.orderDetails);
                if(tmp.salesman_name) {
                    tmp.salesman_name = tmp.salesman_name.userName;
                }
                // 对付款方式和报告领取方式做处理
                switch(parseInt(tmp.payment_type)) {
                    case 1:
                        tmp.payment_type = "现金";
                    case 2:
                        tmp.payment_type = "支票";
                    case 3:
                        tmp.payment_type = "转账";
                }
                switch(parseInt(tmp.get_report_type)) {
                    case 1:
                        tmp.get_report_type = "自取";
                    case 2:
                        tmp.get_report_type = "邮寄";
                }
                tmp.addressSimple = tmp.province + tmp.city + tmp.area;
                delete(tmp.province);
                delete(tmp.city);
                delete(tmp.area);
                // TODO:是否显示详细地址
                console.log(tmp)
                // debugger
                _self.orderDetails = _self.GLOBAL.toChinese(tmp, _self.KEY_DICT);
                console.log(_self.orderDetails)
                // _self.showDeviceType = JSON.parse(window.localStorage.deviceType);
                // _self.showReference = JSON.parse(window.localStorage.reference);
            },
            // 显示设备列表
            showDeviceList: function() {
                var _self = this;
                _self.devList = JSON.parse(window.localStorage.deviceList);
                console.log(_self.devList)
            },
            //添加设备
            addDevice: function() {
                window.location.href = "./#/dev_main/device_add";
            },
            //添加订单
            listAdd: function() {
                let _self = this;
                // 显示loading按钮
                _self.buttonLoading = true;
                let orderTmp = JSON.parse(window.localStorage.orderDetails);
                if(orderTmp.salesman_name) {
                    orderTmp.salesman_name = orderTmp.salesman_name.userId;
                }
                let deviceTmp = JSON.parse(window.localStorage.deviceList);
                // debugger
                for(let i=0; i<deviceTmp.length; i++) {
                    deviceTmp[i].deviceTypeId = deviceTmp[i].deviceTypeId.device_type_id;
                    if(deviceTmp[i].reference) {
                        deviceTmp[i].reference = Object.keys(deviceTmp[i].reference)[0];
                    }
                }
                if(deviceTmp.length === 0) {
                    _self.warnningTag = true;
                    _self.warnningMessage = '至少需要一个设备';
                } else {
                    let orderFinally = {};
                    orderFinally.userId = localStorage.userId;
                    orderFinally.addOrder = orderTmp;
                    orderFinally.addDevice = deviceTmp;
                    window.localStorage.orderFinally = JSON.stringify(orderFinally);
                    console.log(orderFinally)
                    _self.$http({
                        method: 'post',
                        url: 'addOrderAndDevice',
                        data: orderFinally
                    }).then( response => {
                        if(response.data.code === 0) {
                            _self.successFlag = true;
                            //提交成功后跳转页面
                            setTimeout(function(){
                                window.location.href="./#/dev_main/order_type/0";
                            },1500);
                        } else {
                            _self.warnningTag = true;
                            _self.warnningMessage = response.data.msg;
                            // 显示正常按钮
                            _self.buttonLoading = false;
                        }
                    })
                }
            }
        }
    }
</script>

<style scoped>
    .order-info-height {
        height: 1.8rem;
        vertical-align: middle;
    }
    .margin-1 {
        margin: 1rem 0;
    }
    .weui-cell__bd p {
        min-width: 4.5rem;
    }
</style>